/**
 * Created by hxsd on 2016/9/16.
 */
window.onload=function () {
    var oUl=document.getElementById('ul');
    var aLi1=document.getElementById('li1');
    var p1=document.getElementById('p1');
    var p2=document.getElementById('p2');
    var p3=document.getElementById('p3');
    var p4=document.getElementById('p4');
    var p5=document.getElementById('p5');
    var p6=document.getElementById('p6');
    var p7=document.getElementById('p7');
    var p8=document.getElementById('p8');
    var p9=document.getElementById('p9');
    var img1=aLi1.getElementsByTagName('img');
    var aLi2=document.getElementById('li2');
    var img2=aLi2.getElementsByTagName('img');
    var aLi3=document.getElementById('li3');
    var img3=aLi3.getElementsByTagName('img');
    img1[0].onmouseover=function () {
        p1.style='color:red;';
        img1[0].style='transition:1s;transform:rotate(360deg)';
    };
    img1[0].onmouseout=function () {
        p1.style='';
        img1[0].style='';
    };
    img1[1].onmouseover=function () {
        p2.style='color:red;';
        img1[1].style='transition:1s;transform:rotate(360deg)';
    };
    img1[1].onmouseout=function () {
        p2.style='';
        img1[1].style='';
    };
    img1[2].onmouseover=function () {
        p3.style='color:red;';
        img1[2].style='transition:1s;transform:rotate(360deg)';
    };
    img1[2].onmouseout=function () {
        p3.style='';
        img1[2].style='';
    };
    img2[0].onmouseover=function () {
        p4.style='color:red;';
        img2[0].style='transition:1s;transform:rotate(360deg)';
    };
    img2[0].onmouseout=function () {
        p4.style='';
        img2[0].style='';
    };
    img2[1].onmouseover=function () {
        p5.style='color:red;';
        img2[1].style='transition:1s;transform:rotate(360deg)';
    };
    img2[1].onmouseout=function () {
        p5.style='';
        img2[1].style='';
    };
    img2[2].onmouseover=function () {
        p6.style='color:red;';
        img2[2].style='transition:1s;transform:rotate(360deg)';
    };
    img2[2].onmouseout=function () {
        p6.style='';
        img2[2].style='';
    };
    img3[0].onmouseover=function () {
        p7.style='color:red;';
        img3[0].style='transition:1s;transform:rotate(360deg)';
    };
    img3[0].onmouseout=function () {
        p7.style='';
        img3[0].style='';
    };
    img3[1].onmouseover=function () {
        p8.style='color:red;';
        img3[1].style='transition:1s;transform:rotate(360deg)';
    };
    img3[1].onmouseout=function () {
        p8.style='';
        img3[1].style='';
    };
    img3[2].onmouseover=function () {
        p9.style='color:red;';
        img3[2].style='transition:1s;transform:rotate(360deg)';
    };
    img3[2].onmouseout=function () {
        p9.style='';
        img3[2].style='';
    };
};
